<template>
	<view>
		<!-- 顶部用户卡片 -->
		<UserInfoCardVue></UserInfoCardVue>
		<!-- 时间以及类型筛选按钮组 -->
		<filter-button :date-filters="dateFilters" :active-date="activeDate" :type-list="typeList" :isRecord="true"
			:selected-type="selectedType" @updateActiveDate="updateActiveDate"
			@time-range-selected="timeRangeSelected" />
		<!-- Tab栏 -->
		<u-tabs class="mar-5-0" :list="tabList" bg-color="" :is-scroll="false" :current="activeTab"
			@change="changeTab"></u-tabs>
		<view class="report-query-page">
			<!-- 报告列表 -->
			<view class="report-list">
				<view v-if="originalReportList.length > 0">
					<view v-for="(item,index) in originalReportList" :key="index" class="report-item">
						<view class="between">
							<view class="report-title flex-1">{{ item.reportTypeName }}</view>
							<view class="report-link" @click="onViewReport(item)">
								点击查看
								<u-icon name="arrow-right"></u-icon>
							</view>
						</view>
						<!-- <view @click="downLoad(item)">报告下载</view> -->
						<view class="report-time">{{ item.reportTime }}</view>
					</view>
				</view>
				<view v-else class="no-data">
					暂无报告数据
				</view>
			</view>
		</view>
		<LoadVue :load="load"></LoadVue>
	</view>
</template>

<script>
	import UserInfoCardVue from '../../../components/UserInfo/UserInfoCard.vue'
	import FilterButton from './components/filterButton'
	import {
		medicalTechnologyReportCheck,
		medicalTechnologyReportTest
	} from '../../../api/medicalTechnologyReport'
	import {
		mapGetters
	} from 'vuex'
	import {
		dateDefault,
		dateFormat,
		getPastDate
	} from '../../../utils/assist'
	import {
		uploadPdf
	} from '../../../api/upload'
	export default {
		components: {
			UserInfoCardVue,
			FilterButton,
		},
		data() {
			return {
				dateFilters: [{
						label: '一月内',
						value: '1m'
					},
					{
						label: '半年内',
						value: '6m'
					},
					{
						label: '一年内',
						value: '1y'
					},

				],
				activeDate: '1m',
				originalReportList: [],
				typeList: [],
				selectedType: '全部',
				selectedTypeValue: 'all',
				activeTab: 0,
				tabList: [{
						type: 0,
						name: "检查",
						code: "05"
					},
					{
						type: 1,
						name: "检验",
						code: "06"
					}
				],
				listCheck: [{
						label: '全部',
						value: 'all'
					},
					{
						label: '普放',
						value: 'x'
					},
					{
						label: '放射',
						value: '1'
					},
					{
						label: '彩超',
						value: '2'
					},
					{
						label: 'B超',
						value: '3'
					},
					{
						label: '胃镜',
						value: '4'
					},
					{
						label: '肠镜',
						value: '5'
					},
					{
						label: '心电图',
						value: '6'
					},
					{
						label: '脑电图',
						value: '7'
					},
					{
						label: '其他',
						value: '0'
					},
				],
				listTest: [{
						label: '全部',
						value: 'all'
					},
					{
						label: '生化',
						value: '1'
					},
					{
						label: '临检',
						value: '2'
					},
					{
						label: '免疫',
						value: '3'
					},
					{
						label: '其他',
						value: '4'
					},
					{
						label: '血气',
						value: '5'
					},
					{
						label: '血常规',
						value: '6'
					},
					{
						label: '尿常规',
						value: '7'
					},
					{
						label: '大便常规',
						value: '8'
					},
					{
						label: '蛋白电泳',
						value: '9'
					},
					{
						label: '微生物',
						value: '10'
					},
					{
						label: '细胞检验',
						value: '11'
					},
					{
						label: '输血科',
						value: '12'
					},
					{
						label: '细胞遗传',
						value: '15'
					},
					{
						label: '肾病实验室',
						value: '16'
					},
				],
				beginTime: '',
				endTime: "",
				load: false,

			}
		},
		computed: {
			...mapGetters([
				'userInfo'
			]),

		},
		mounted() {
			this.typeList = this.listCheck;
			this.setSelectDate()
			this.init()
		},
		methods: {
			init() {
				this.load = true;
				if (this.activeTab == 0) {
					medicalTechnologyReportCheck({
						queryType: '8',
						// queryValue: this.userInfo.patId,
						queryValue: '396126',
						medicalType: this.tabList[this.activeTab].code,
						beginTime: this.beginTime,
						endTime: this.endTime
					}).then(res => {
						console.log(res)
						this.originalReportList = res
					}).finally(() => {
						this.load = false;
					})
				} else {
					medicalTechnologyReportTest({
						queryType: '8',
						queryValue: '394151',
						// queryValue: this.userInfo.patId,
						medicalType: this.tabList[this.activeTab].code,
						beginTime: this.beginTime,
						endTime: this.endTime
					}).then(res => {
						this.originalReportList = res
					}).finally(() => {
						this.load = false
					})
				}

			},
			updateActiveDate(e) {
				this.activeDate = e;
				this.setSelectDate()
				this.init()
			},
			setSelectDate() {
				this.endTime = dateFormat('yyyy-MM-dd', new Date())
				switch (this.activeDate) {
					case '1m':
						this.beginTime = getPastDate(1, 'month')
						break;
					case '6m':
						this.beginTime = getPastDate(6, 'month')
						break;
					case '1y':
						this.beginTime = getPastDate(12, 'month')
						break;
					case 'all':
						this.beginTime = getPastDate(120, 'month')
						break;
					default:
						// timeMatch = true;
				}
				this.beginTime = dateFormat(('yyyy-MM-dd'), new Date(this.beginTime))
			},
			onViewReport(item) {
				item.medicalType = this.tabList[this.activeTab].code
				// item.applyBillNo = "755327"
				item.reportFileDowPath = ""
				// 查看报告逻辑
				uni.navigateTo({
					url: `/pages/Home/ServePatient/ReportDetail?item=` + JSON.stringify(item)
					// url: `/pages/Home/ServePatient/ReportDetail?applyBillNo=` + item.applyBillNo
				});
			},
			timeRangeSelected(e) {
				this.beginTime = e.startDate;
				this.endTime = e.endDate
				this.init();
			},
			changeTab(e) {
				this.activeTab = e
				if (this.activeTab == 0) {
					this.typeList = this.listCheck
				} else {
					this.typeList = this.listTest
				}
				this.init()
			},
			downLoad(item) {
				uploadPdf({
					picUrl: item.reportFileDowPath,
					patId: this.userInfo.patId
				}).then(res => {
					console.log(res)
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.report-query-page {
		padding: 16rpx;
	}

	// .report-list {
	// 	margin: 24rpx;
	// }

	.report-item {
		background: #fff;
		border-radius: 12rpx;
		padding: 28rpx 24rpx 18rpx 24rpx;
		margin-bottom: 20rpx;
		box-shadow: 0 2rpx 8rpx rgba(30, 198, 230, 0.06);
	}

	.report-title {
		font-size: 30rpx;
		color: #222;
		font-weight: bold;
		margin-bottom: 10rpx;
	}

	.report-time {
		font-size: 24rpx;
		color: #999;
		margin-bottom: 8rpx;
	}

	.report-link {
		right: 24rpx;
		top: 32rpx;
		color: #1ec6e6;
		font-size: 26rpx;
		cursor: pointer;

		.arrow {
			font-size: 26rpx;
			margin-left: 2rpx;
		}
	}

	.no-data {
		text-align: center;
		padding: 40rpx;
		color: #999;
		font-size: 28rpx;
	}
</style>